﻿@{
    ViewBag.Title = "Vẽ sơ đồ địa bàn";
    Layout = "~/Views/Shared/_LayoutAdmin.cshtml";
}

<link href="@Url.Content("~/Content/styleMap_navbar.css")" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="http://viettelmap.vn/VTMapService/VTMapAPI?api=VTMap&type=main&k=dffc8675fc5d781ea8f0131f7d855565"></script>
<script type='text/javascript' src="~/Scripts/JsmapAreaDrawNew.js"></script>
<script src="~/Scripts/Airview-master/vendor/tooltip.min.js"></script>
<script src="~/Scripts/Airview-master/airview.min.js"></script>

<script>
       @functions{
           public string GetAntiForgeryToken()
           {
               string cookieToken, formToken;
               AntiForgery.GetTokens(null, out cookieToken, out formToken);
               return cookieToken + "," + formToken;
           }
       }
    var strUrlAddBP = '@Url.Action("AddAreaBoundPoint", "Area")';
    var strUrlGetAllCode = '@Url.Action("GetAllAreaCode", "Area")';
    var strUrlGetAreaCode = '@Url.Action("GetAreaBoundPointByAreaCode", "Area")';
    var headers = {};
    $(document).ready(function () {
        var serviceUrl = null;
        var strCommuneCode = null;
        serviceUrl = '@ViewBag.ServiceUrl';
        strCommuneCode = '@ViewBag.CommuneCode';
        loadMapToDraw("1", serviceUrl, strCommuneCode);
        window.onload = function () {
            headers['VerificationToken'] = '@GetAntiForgeryToken()';
        }

        $('#close1').click(function () {
            $('#success').hide(1000);
        });

        $('#close2').click(function () {
            $('#success').hide(1000);
        });
        
    });

    $(document).bind("keypress", function (e) {
        if (e.keyCode === 27) {
            $('#success').hide(1000);
        }
    });
</script>


<div class="full-height-content">
    <div class="full-height-content-body" style="overflow:hidden;">

        <div id='map' class="map_content">
        </div>

        <div class="row" style="position: absolute; clear: left; z-index: 1000; ">
            <table cellpadding="0" cellspacing="0">
                <tr>
                    <td style="padding-left:15px;">
                        <div id="optionDiaBanDieuTra">
                            @Html.DropDownList("selectDiBanDieuTra", ViewData["LIST_AREA"] as List<SelectListItem>, "Chọn địa bàn điều tra", new { @class = "form-control  input-medium" })
                        </div>
                    </td>
                    <td style="padding-left:5px;">
                        <button id="viewArea" class="btn btn-default"> Xem ranh giới những địa bàn đã vẽ</button>
                    </td>
                </tr>
            </table>
        </div>

        <div id="btnnew" class="modal-dialog" style="display: none; margin-top: 1%; margin-left: 50%; position: absolute; clear: left; z-index: 1000;">
            <div class="modal-content" style="max-width: 320px; ">
                <div class="modal-body">
                    <b>Địa bàn chưa được thiết lập trên bản đồ.</b>
                    <br /><b>Bạn có muốn vẽ mới không?</b>
                </div>
                <div class="modal-footer">
                    <div class="btn-group" role="group" aria-label="...">
                        
                        <button id="drawnew" type="button" class="btn btn-default"><i class="fa fa-pencil"></i> Bắt đầu vẽ</button>
                    </div>
                </div>
            </div>
        </div>

        <div id="btnconfirm" class="modal-dialog" style="display: none; margin-top: 1%; margin-left: 50%; position: absolute; clear: left; z-index: 1000; ">
            <div class="modal-content" style="max-width: 320px; ">
                <div class="modal-body">
                    <b>Bạn có lưu địa bàn vừa vẽ không?</b>
                </div>
                <div class="modal-footer">
                    <div class="btn-group" role="group" aria-label="...">
                        <button id="yes" class="btn btn-default"><i class="fa fa-floppy-o"></i> Lưu</button>
                        <button id="no" class="btn btn-default" value="1"><i class='fa fa-reply'></i> Không</button>
                    </div>
                </div>
            </div>
        </div>

        <div id="btncontinue" class="modal-dialog" style="display: none; margin-top: 1%; margin-left: 50%; position: absolute; clear: left; z-index: 1000; ">
            <div class="modal-content" style="max-width: 320px; ">
                <div class="modal-body">
                    <b>Địa bàn chưa được thiết lập trên bản đồ.</b>
                    <br /><b>Bạn vẽ lại không?</b>
                </div>
                <div class="modal-footer">
                    <div class="btn-group" role="group" aria-label="...">
                        <button id="continue" class="btn btn-default">
                            <i class="fa fa-pencil"></i> Vẽ lại địa bàn</button>
                    </div>
                </div>
            </div>
        </div>

        <div id="success" class="modal-dialog" style="display: none; min-width: 150px; max-width: 250px; position: absolute; z-index: 1000; margin-left:30%; margin-top:15%;" tabindex="-1">
            <div class="modal-content">
                <div class="modal-body">
                    <button id="close1" class="bootbox-close-button close" aria-hidden="true" data-dismiss="modal" type="button">×</button>
                    <h4 class="modal-title" style="text-align:center;"><b> Thêm mới thành công. </b></h4>
                </div>
                <div class="modal-footer">
                    <button id="close2" class="btn btn-default">
                        <i class="fa fa-times"></i> Đóng
                    </button>
                </div>
            </div>
        </div>

    </div>
</div>